<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>患者缴费记录页面</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <base href="<%=url%>">
    <script src="https://lib.baomitu.com/jquery/3.4.1/jquery.min.js"></script>
    <script src="https://lib.baomitu.com/layui/2.6.5/layui.min.js"></script>
    <link href="https://lib.baomitu.com/layui/2.6.5/css/layui.min.css" rel="stylesheet">
    <style type="text/css">
        #input-limit{
            height: 30px;
            background-color: #1e9fff;
            color: whitesmoke;
            width: 60px;
            border:1px #1e9fff;
            border-radius: 4px;
        }

        #input-limit:hover{
            background-color:#bbdaff;
        }
        /*.layui-layer{*/
        /*top: 100px !important;*/
        /*}*/
    </style>
</head>
<body>

<div class="layui-main">
    <!-- 表格上方标题 -->
    <blockquote class="layui-elem-quote">患者缴费记录页面</blockquote>
    <div style="padding-left: 50px">
        <!--<a style="margin-left: 50px"><span style="font-size: 18px;margin-right: 10px">ID查询:</span><input type="text" placeholder="请输入ID" id="input-uid" style="height: 30px"></a>-->
        <a style="margin-left: 50px"><span style="font-size: 18px;margin-right: 10px">患者卡号:</span><input type="text" placeholder="请输入卡号" id="input-uname" style="height: 30px"></a>
        <button   id="input-limit">搜索</button>
    </div>
    <hr/>
    <!-- 消费信息表 -->
    <table id="tbl" lay-filter="tbl">

    </table>

    <!--<script type="text/html" id="tbl-toolbar">-->
    <!--&lt;!&ndash;<a class="layui-btn layui-btn-xs" lay-event="edit">体检信息</a>&ndash;&gt;-->
    <!--<a class="layui-btn layui-btn-xs" lay-event="del" >药品详情</a>-->
    <!--</script>-->
</div>
</body>
</html>
<script>

    var UpIndex;
    layui.use(['jquery', 'table', 'layer', 'form'], function () {
        var $ = layui.$;
        var table = layui.table;
        var layer = layui.layer;
        var form = layui.form;
        table.render({
            elem: '#tbl',
            url: '/expenCalend/etquery',
            method: 'get',
            //无数据的时候显示的提示信息
            text:{
                none:'当前无消费记录'
            },
            initSort: { //排序
                field: 'ectime' //排序字段，对应 cols 设定的各字段名
                , type: 'desc' //排序方式  asc: 升序、desc: 降序、null: 默认排序
            },
            cols: [[
                {field: 'ecid', title: '消费表编号'},
                {field: 'visid', title: '患者卡号',},
                {field: 'ectime', title: '取药时间',templet: "<div>{{layui.util.toDateString(d.ectime, 'yyyy-MM-dd')}}</div>", width: 130},
                {field: 'purpose', title: '用途'},
                {field: 'money', title: '消费金额'},
            ]],
            page: {
                limit: 5,//指定每页显示的条数
                limits: [5, 10, 20, 40, 50, 60, 80, 100]//每页条数的选中
            }//开启分页

            , parseData: function (res) { //将原始数据解析成 table 组件所规定的数据，res为从url中get到的数据
                var result;
                if (this.page.curr) {
                    result = res.data.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
                } else {
                    result = res.data.slice(0, this.limit);
                }
                return {
                    "code": res.code, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.count, //解析数据长度
                    "data": result //解析数据列表
                };
            },
            id: 'tbl'
        });


        $("#input-limit").click(function () {
            var visid=$("#input-uname").val();
            table.render({
                elem: '#tbl',
                url: '/expenCalend/etlistById?visid='+visid,
                method: 'get',
                //无数据的时候显示的提示信息
                text:{
                    none:'当前无缴费记录'
                },
                initSort: { //排序
                    field: 'ectime' //排序字段，对应 cols 设定的各字段名
                    , type: 'desc' //排序方式  asc: 升序、desc: 降序、null: 默认排序
                },
                cols: [[
                    {field: 'ecid', title: '消费表编号'},
                    {field: 'visid', title: '患者卡号',},
                    {field: 'ectime', title: '取药时间',templet: "<div>{{layui.util.toDateString(d.ectime, 'yyyy-MM-dd')}}</div>", width: 130},
                    {field: 'purpose', title: '用途'},
                    {field: 'money', title: '消费金额'},
                ]],
                page: {
                    limit: 5,//指定每页显示的条数
                    limits: [5, 10, 20, 40, 50, 60, 80, 100]//每页条数的选中
                }//开启分页

                , parseData: function (res) { //将原始数据解析成 table 组件所规定的数据，res为从url中get到的数据
                    var result;
                    if (this.page.curr) {
                        result = res.data.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
                    } else {
                        result = res.data.slice(0, this.limit);
                    }
                    return {
                        "code": res.code, //解析接口状态
                        "msg": res.msg, //解析提示文本
                        "count": res.count, //解析数据长度
                        "data": result //解析数据列表
                    };
                },
                id: 'tbl'
            });
        })
    })
</script>